<template>
  <a-card :bordered="false">
    <a-row type="flex" justify="space-between" slot="title"
      >{{ title }}<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button></a-row
    >
    <a-table
      ref="table"
      rowKey="id"
      size="middle"
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      :loading="loading"
      @change="handleTableChange"
    >
      <span slot="action" slot-scope="text, record">
        <a @click="handleEdit(record)">编辑</a>
        <a-divider type="vertical" />
        <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
          <a>删除</a>
        </a-popconfirm>
      </span>
    </a-table>

    <!-- 字典类型 -->
    <dict-item-modal ref="modalForm" @ok="modalFormOk"></dict-item-modal>
  </a-card>
</template>

<script>
import { postAction, getAction, deleteAction } from '@/api/manage'
import DictItemModal from '../../system/modules/DictItemModal'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
  name: 'DictConfig',
  mixins: [JeecgListMixin],
  components: {
    DictItemModal
  },
  props: {
    title: String,
    dictId: {
      type: String,
      default() {
        return '1337375593171611650'
      }
    }
  },
  data() {
    return {
      columns: [
        {
          title: '选项',
          align: 'center',
          dataIndex: 'itemText'
        },
        {
          title: '数值',
          align: 'center',
          dataIndex: 'itemValue'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      dataSource: [],
      queryParam: {
        dictId: '',
        dictName: '',
        itemText: '',
        delFlag: '1',
        status: []
      },
      visible: false,
      model: {},
      status: 1,
      isorter: {
        column: 'sortOrder',
        order: 'asc'
      },
      form: this.$form.createForm(this),
      url: {
        list: '/sys/dictItem/list',
        delete: '/sys/dictItem/delete',
        deleteBatch: '/sys/dictItem/deleteBatch'
      }
    }
  },
  watch: {
    dictId: {
      handler(nv, ov) {
        this.queryParam.dictId = nv
        this.loadData()
      },
      immediate: true
    }
  },
  methods: {
    // 添加字典数据
    handleAdd() {
      this.$refs.modalForm.add(this.dictId)
      this.$refs.modalForm.title = '新增'
    },
    add(dictId) {
      this.dictId = dictId
      this.edit({})
    },
    edit(record) {
      if (record.id) {
        this.dictId = record.id
      }
      this.queryParam = {}
      this.form.resetFields()
      this.model = Object.assign({}, record)
      this.model.dictId = this.dictId
      this.model.status = this.status
      this.visible = true
      this.$nextTick(() => {
        this.form.setFieldsValue(pick(this.model, 'itemText', 'itemValue'))
      })
      // 当其它模块调用该模块时,调用此方法加载字典数据
      this.loadData()
    }
  }
}
</script>

<style></style>
